<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

    <input type="checkbox" class="a" value="全选" onclick="func()"> 全选 <br>
    <input type="checkbox" class="b" value="选项1">选项1 <br>
    <input type="checkbox" class="b" value="选项2">选项2 <br>
    <input type="checkbox" class="b" value="选项3">选项3 <br>

</body>
<script>
    let a = document.querySelector(".a")
    let b = document.querySelectorAll(".b")
    function func() {
      for(i=0;i<b.length;i++){
        b[i].checked=a.checked;
      }


    }
    for(i=0;i<b.length;i++){
        b[i].onclick=function(){
            a.checked=IsChecked(b);
        }

    }
    function IsChecked(b){
        for(i=0;i<b.length;i++){
            if(b[i].checked==false){
                return false;
            }
        }
        return true;
    }
    
    

</script>

</html>